<style lang="less" scoped>
.container{
	width: 100%;
	height: 100%;
	.store-bar{
		margin: 10px 0px 5px;
		width: 100%;
		height: 36px;
		line-height: 36px;
		display: flex;
		font-size: 14px;
		color: #6D6D6D;
		background: #fff;
		li{
			flex: 1;
			display: flex;
			justify-content: center;
			align-items: center;
			>img.select{
				width: 12px;
				height: 12px;
				margin-left: 5px;
			}
			>img.cartImg{
				width: 5px;
				height: 12px;
				margin-left: 5px;
			}
		}
		li.current{
			color: #7A1634
		}
		li:last-child{
			border-left: 1px solid #e5e5e5;
		}
	}
	.pro-con{
		width: 100%;
		height: auto;

		padding: 0 10px;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		box-sizing: border-box;
	}
}
</style>
<template>
<div class="container">
	<!--<shop-item></shop-item>
	<buy-shop></buy-shop>-->
	<!-- <screen></screen> -->
	<!-- <alert 
		title="确定移除？">
	</alert> -->
	<!-- 折扣价格弹窗组件 <discount :list="testList"></discount> -->
	<!-- 计数器组件 <counter :count="count" @setCount="setCount"></counter> -->
	<!--列表组件 <cell-item :cell-icon="cellIcon" :cell-info="cellInfo"></cell-item> -->
	<!--上传图片组件-->
	<!--<choose-image :img-list="imgList" @changeImgList="changeImgList"></choose-image>-->
	<store-hread></store-hread>
	<ul class="store-bar">
		<li class="current">新品</li>
		<li>销量</li>
		<li>
			<span>价格</span>
			<img :src="cartImg" class="cartImg"/>
		</li>
		<li @click="showOrCloseScreen" >
			<span>筛选</span>
			<img :src="selectImg" class="select"/>
		</li>
	</ul>
	<div class="pro-con">
		<shop-item @click="goProDetail"></shop-item>
		<shop-item @click="goProDetail"></shop-item>
		<shop-item @click="goProDetail"></shop-item>
		<shop-item @click="goProDetail"></shop-item>
		<shop-item @click="goProDetail"></shop-item>
		<shop-item @click="goProDetail"></shop-item>
	</div>
	<screen v-if="screenFlag" @close="showOrCloseScreen"></screen>
	<foot-bar @card="toPage('card')"></foot-bar> 
</div>
</template>

<script>
import storeHread from './components/store-hread.vue'
import footBar from '@/components/foot-bar/index.vue'
import alert from '@/components/alert/index.vue'
import shopItem from '@/components/shop-item/index.vue'
import screen from '@/components/screen/index.vue'
import buyShop from '@/components/buy-shop/index.vue'
import share from '@/assets/images/share.png'
import selectImg from '@/assets/images/index/select.png'
import cartImg from '@/assets/images/index/cart.png'



export default {
	title:'首页',
	data () {
		return {
			share:share,
			selectImg:selectImg,
			cartImg:cartImg,
			screenFlag: false
		}
	},
	components: {
		footBar,
		alert,
		shopItem,
		screen,
		buyShop,
		storeHread
	},
	methods: {
		showOrCloseScreen(){
			this.screenFlag = !this.screenFlag
		},
		goProDetail(){
			wx.navigateTo({
		        url: '/pages/pro-detail/main'
		    })
		}
	}
}
</script>